<!DOCTYPE html>
<html>
  <head>
    <base href="/">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="styles.css">

    <script src="node_modules/core-js/client/shim.min.js"></script>

    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>

    <script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
    <script src="node_modules/@angular/core/bundles/core.umd.js"></script>
    <script src="node_modules/@angular/common/bundles/common.umd.js"></script>
    <script src="node_modules/@angular/compiler/bundles/compiler.umd.js"></script>
    <script src="node_modules/@angular/platform-browser/bundles/platform-browser.umd.js"></script>
    <script src="node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js"></script>
    <script src="node_modules/@angular/router-deprecated/bundles/router-deprecated.umd.js"></script>

    <script src="app/data.service.js"></script>
    <script src="app/hero.component.js"></script>
    <script src="app/hero-dsl.component.js"></script>
    <script src="app/hero-lifecycle.component.js"></script>
    <script src="app/hero-io.component.js"></script>
    <script src="app/hero-di.component.js"></script>
    <script src="app/hero-di-inline.component.js"></script>
    <script src="app/hero-di-inject.component.js"></script>
    <script src="app/hero-di-inject-additional.component.js"></script>
    <script src="app/heroes-bindings.component.js"></script>
    <script src="app/heroes-queries.component.js"></script>
    <script src="app/main.js"></script>
  </head>

  <body>
    <a id="toc"></a>
    <h1>TypeScript to JavaScript</h1>
    <a href="#class-metadata">Classes and Class Metadata</a><br>
    <a href="#property-metadata">Input and Output Metadata</a><br>
    <a href="#dependency-injection">Dependency Injection</a><br>
    <a href="#other-property-metadata">Host and Query Metadata</a><br>

    <hr>
    <h4 id="class-metadata">Classes and Class Metadata</h4>
    <hero-view>Loading hero-view...</hero-view>
    <hero-view-2>Loading hero-view2...</hero-view-2>
    <hero-lifecycle>Loading hero-lifecycle...</hero-lifecycle>

    <hr>
    <h4 id="property-metadata">Input and Output Metadata</h4>
    <hero-io>Loading hero-io...</hero-io>

    <hr>
    <h4 id="dependency-injection">Dependency Injection</h4>
    <hero-di>Loading hero-di...</hero-di>
    <hero-di-inline>Loading hero-di-inline...</hero-di-inline>
    <hero-di-inline2>Loading hero-di-inline2...</hero-di-inline2>
    <hero-di-inject>Loading hero-di-inject...</hero-di-inject>
    <hero-di-inject-additional>Loading hero-di-inject-additional...</hero-di-inject-additional>

    <hr>
    <h4 id="other-property-metadata">Host and Query Metadata</h4>
    <heroes-bindings>Loading heroes-bindings...</heroes-bindings>
    <heroes-queries>Loading heroes-queries...</heroes-queries>
  </body>

</html>
